<template>
	<div class="back_contain_n SystemLog"  v-loading="excelLoading" element-loading-text="正在下载excel...">
		<!-- 头部搜索 -->
		<div class="Search_Top_Part">
			<div class="search_list">
				<div>
					<div class="input_flex">
						<el-input clearable v-model="queryForm.name" placeholder="用户名"></el-input>
					</div>
					<div class="input_flex">
						<el-date-picker v-model="time" type="daterange" range-separator="-"
										start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
					</div>
				</div>
			</div>
			<div class="search_bt">
				<span class="zll-search edit" v-if="hasRole('log:system:download')" @click="exportExcel"><i class="el-icon-download"></i> 下载</span>
				<span class="zll-search" @click="getList(0)">搜索</span>
				<span class="zll-search-reset" @click="searchReset()">重置</span>
			</div>
		</div>
		<!-- table -->
		<sys-table class="m_table"
				   ref="systable"
				   :isMultipleSelection="false"
				   :tableData="tableData"
				   :tableLoading="tableLoading"
				   :tableHeader="tableHeader"
				   :scopeWidth="120"
				   :isOperate="false"
				   :backCount="backCount"
				   @getBackData="getList"
		>
		</sys-table>
	</div>
</template>

<script>
	import {export2Excel} from '@/plugins/export2Excel'
	import {formatDate} from "@/plugins/formatDate";

	export default {
		data() {
			return {
				time:[],
               	queryForm:{name:''},
				tableLoading: true, //table刷新
				tableData: [],
				tableHeader: [],
				excelLoading:false,
				backCount: 0,
			}
		},
		methods: {
			exportExcel () {
				let self = this
				self.excelLoading = true
				if (this.time && this.time.length == 2) {
					//date类型
					self.queryForm.startTime = formatDate(new Date(self.time[0]), 'yyyy-MM-dd')
					self.queryForm.endTime = formatDate(new Date(self.time[1]), 'yyyy-MM-dd') + ' 23:59:59'
				} else {
					self.queryForm.startTime = ''
					self.queryForm.endTime = ''
				}

				self.$http({
					url: "/jinl/systemLog/queryAllSystemLogs",
					method: "post",
					params:this.queryForm
				}).then(resp=>{
					self.excelLoading = false
					if (resp == null) {
						self.$message.error('服务器断开！')
						return
					}
					if (!resp.success) {
						self.$message.error('导出EXCEL报错!')
					} else {
						let header = [
							{key: 'createTimeFt', title: '时间'},
							{key: 'userName', title: '用户名'},
							{key: 'moduleName', title: '模块'},
							{key: 'detail', title: '详情'},
							// {key: 'ip', title: '操作ip'},
							// {key: 'port', title: '端口号'}
						]
						export2Excel(header,resp.result)
					}
				})

			},
			getList(startIndex, pageRow) {
				let self = this;
				self.tableLoading = true;
				if (this.time && this.time.length == 2) {
					//date类型
					self.queryForm.startTime = formatDate(new Date(self.time[0]), 'yyyy-MM-dd')
					self.queryForm.endTime = formatDate(new Date(self.time[1]), 'yyyy-MM-dd') + ' 23:59:59'
				} else {
					self.queryForm.startTime = ''
					self.queryForm.endTime = ''
				}

				let pageInfo = self.$refs.systable.getPageInfo(startIndex);
				if (pageInfo.pageNum == 0||startIndex == 0) {
					self.$refs.systable.resetPage();
				}
				self.queryForm.startIndex = pageInfo.pageNum;
				self.queryForm.totalPage = pageInfo.pageSize;

				self.$http({
					url: "/jinl/systemLog/querySystemLogs",
					method: "post",
					params:self.queryForm
				}).then(resp => {
					if (resp.success) {
						self.tableLoading = false;
						self.tableData = resp.result;
						self.tableHeader =  [{"columnValue": "createTimeFt", "columnName": "时间","width":150},
							{"columnValue": "userName", "columnName": "用户名"},
							{"columnValue": "moduleName", "columnName": "模块"},
							{"columnValue": "detail", "columnName": "详情"},
							// {"columnValue": "ip", "columnName": "操作ip"},
							// {"columnValue": "port", "columnName": "端口号"},
						];
						if (resp.result.length > 0) {
							self.backCount = resp.result[0].count;
						} else {
							self.backCount = 0;
						}
					}
				});

			},
			searchReset() { //重置搜索
				this.queryForm.name = '';
				this.time = [];
				this.getList();
			},
		},
		mounted() {
			this.getList();//显示table
		},
	}
</script>

<style lang="scss" scoped>
	@import "@/style/SearchTop.scss";

	.SystemLog {
		.m_table {
			margin-top: 5px;
		}
	}
</style>
